import { InputNumber, message, Modal } from 'antd';
import React, { useState } from 'react';
import { request } from 'umi';

type withdrawModalProps = {
  setUnvisible: () => void;
  balance: number;
  currOwner: string;
};
const WithdrawModal: React.FC<withdrawModalProps> = (props) => {
  const { setUnvisible, balance, currOwner } = props;
  const [withdrawNum, setWithdrawNum] = useState<number | undefined>(0);
  return (
    <Modal
      title="提现金额"
      visible
      destroyOnClose
      centered
      onOk={async () => {
        const withdrawal = (withdrawNum || 0) * 100;
        if (withdrawNum !== undefined && withdrawal <= balance) {
          const res = await request('/finance/withdrawal', {
            method: 'POST',
            params: {
              ownerId: currOwner,
              withdrawalAmount: withdrawNum,
            },
          });
          if (res.data) {
            setUnvisible();
            message.success({ content: '提现成功', key: 'has_withdrawed' });
            return true;
          }
        }
        message.error({ content: '提现失败，余额不足', key: 'not_enough' });
        return false;
      }}
      onCancel={() => {
        setUnvisible();
      }}
      okText="提现"
      cancelText="取消"
    >
      <InputNumber
        step={0.01}
        min={0}
        name="withdrawNum"
        value={withdrawNum}
        precision={2}
        onChange={(val) => setWithdrawNum(val)}
      />
    </Modal>
  );
};
export default WithdrawModal;
